<template>
  <div>
    <el-dialog

      class="global-dialog"
      v-model="dialog"
      :lock-scroll="false"
      :append-to-body="false"
      width="950px"
      :show-close="false"

      :close-on-click-modal="false"
    >

        <div class="my-header">
          <el-tabs v-model="data.activeName" class="demo-tabs">
            <el-tab-pane :label="title" name="first">
              <el-form :model="searchParams" status-icon ref="ruleFormRef">
                <el-row :gutter="20">
                  <el-col :span="14">
                    <el-form-item label="得分">
                      <el-input
                        placeholder="请输入得分"
                        v-model="searchParams.expertscore"
                        :min="1"
                        :maxlength="2"
                        oninput="value=value.replace(/[^0-9]/g, '')"  clearable
                      >
                        <template v-slot:append>分</template>
                      </el-input>
                    </el-form-item>
                  </el-col>

                  <el-col :span="24">
                    <el-form-item label="意见" prop="projectname">
                      <el-input
                        :autosize="{ minRows: 6, maxRows: 10 }"
                        type="textarea"
                        placeholder="请输入"
                        v-model="searchParams.expertopinion"
                        style="width: 100%" maxlength="512" show-word-limit
                      />
                    </el-form-item>
                  </el-col>
                </el-row>
              </el-form>
            </el-tab-pane>
          </el-tabs>
        </div>


      <template #footer>
        <span class="dialog-footer">
          <el-button size="small"  @click="close"
            >关闭</el-button
          >
          <el-button size="small" type="primary"  @click="submitState(1)"
            >同意</el-button
          >
          <el-button size="small" type="danger"  @click="submitState(2)"
            >不同意</el-button
          >
        </span>
      </template>
    </el-dialog>
  </div>
</template>

<script lang="ts">
import { ElMessage } from "element-plus";
import { reactive, ref } from "vue";
import { secoreApprove } from "../../../api/formExamination";

export default {
  components: {},
  props: {
    checkId: {
      type: String,
      required: true,
    },
    dialog: {
      type: Boolean,
      default: false,
    },
    title: {
      type: String,
      default: "",
    },
  },
  setup(props, { emit }) {
    let data = reactive({
      activeName: ref("first"),
    });

    // expertconclusion  同意1 不同意2

    let searchParams = reactive({
      expertscore: "",
      expertopinion: "",
    });

    const close = () => {
      ruleFormRef.value.resetFields();
      emit("changeDialog");
    };

    const ruleFormRef = ref();

    const submitState = async (state: any) => {


      await ruleFormRef.value.validate((valid: any) => {
        if (valid) {
          // 父子组件传值,获取父组件id
          secoreApprove({
            id: props.checkId,
            expertconclusion: state,
            ...searchParams,
          }).then((res) => {
            if (res.data.code == 200) {
              close();
              ElMessage({
                message: "操作成功",
                type: "success",
              });
            }
          });
        }
      });
    };

    return {
      close,
      ruleFormRef,
      searchParams,
      data,
      submitState,
    };
  },
};
</script>

<style scoped lang="scss"></style>
